<template>
  <div class="search">
    <el-row type="flex" justify="center" align="center">
      <el-col :span="16" :offset="4">
        <div>
          <el-input
            v-model="iptValue"
            placeholder="请输入内容"
            class="input-with-select"
          >
            <el-button
              slot="append"
              icon="el-icon-search"
              @click.native="search"
              >搜索</el-button
            >
          </el-input>
        </div>
      </el-col>
      <el-col :span="8" v-if="isShow">
        <el-button type="primary" @click="add">{{ btnText }}</el-button>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { mapMutations, mapActions } from 'vuex'
export default {
  data () {
    return {
      iptValue: ''
    }
  },
  props: {
    isShow: {
      type: Boolean,
      default: true
    },
    btnText: {
      type: String,
      required: true
    }
  },
  methods: {
    ...mapActions('cinema', ['changeIsAdd']),
    ...mapMutations('user', ['changeIsDialog']),
    ...mapActions('movie', ['changeIsDialog']),
    ...mapActions('hall', ['changeIsDialog']),
    ...mapActions('schedule', ['changeIsDialog']),
    search () {
      // 搜索用户
      if (this.btnText === '添加用户') {
        return this.$emit('searchUser', this.iptValue)
      }
      // 搜索电影
      if (this.btnText === '添加电影') {
        return this.$emit('searchMovie', this.iptValue)
      }
      // 搜索影院
      if (this.btnText === '添加影院') {
        return this.$emit('searchCinema', this.iptValue)
      }
      // 搜索影厅
      if (this.btnText === '添加影厅') {
        return this.$emit('searchHall', this.iptValue)
      }
      // 安排电影
      if (this.btnText === '安排电影') {
        return this.$emit('searchMovieSchedule', this.iptValue)
      }
    },
    add () {
      if (this.btnText === '添加用户') {
        this.changeIsDialog(true)
      }
      if (this.btnText === '添加电影') {
        this.$store.dispatch('movie/changeIsDialog', true)
      }
      if (this.btnText === '添加影院') {
        this.$parent.isDialog = true
        this.changeIsAdd(true)
      }
      if (this.btnText === '添加影厅') {
        this.$store.dispatch('hall/changeIsDialog', true)
      }
      if (this.btnText === '安排电影') {
        this.$store.dispatch('schedule/changeIsDialog', true)
      }
    }
  }
}
</script>

<style>
.search {
  margin-bottom: 20px;
}
</style>
